<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>消防应急管理平台</title>
    <link rel="shortcut icon" href="../static/img/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" type="text/css" href="../static/css/style.css">
    <link rel="stylesheet" type="text/css" href="../static/css/home.css">
    <link rel="stylesheet" type="text/css" href="../static/js/layui/css/layui.css">
</head>

<body>
    <div class="app">
        <div class="header">
            <div class="header-content">
                <div class="header-content-top">
                    <div class="header-content-top-left">
                        <img src="../static/img/clock.png" alt="">
                        <div id="week"></div>
                        <div class="line"></div>
                        <div id="date"></div>
                        <div id="time"></div>
                        <img src="../static/img/position.png">
                        <div id="district">栖霞区</div>
                    </div>
                    <div class="header-content-top-right">
                        <img src="../static/img/temp.png" alt="">
                        <div id="temperature"></div>
                        <div class="line"></div>
                        <div id="weather"></div>
                        <div class="username">
                            <img src="../static/img/username.png">
                            <span>admin</span>
                        </div>
                        <div class="logout" onclick="logout()">
                            注销
                        </div>
                    </div>
                </div>
                <div class="header-nav">
                    <div class="header-nav-item" id="nav-home">首页</div>
                    <div class="header-nav-item" id="nav-index">应急管理</div>
                    <div class="header-nav-item" id="nav-firepm">物联网监控</div>
                    <div class="header-nav-item" id="nav-fireStatistics">火灾统计系统</div>
                    <div class="header-nav-item" id="nav-statistics">统计报表</div>
                    <div class="header-nav-item" id="nav-maintenance">维保管理</div>
                    <div class="header-nav-item" id="nav-firecar">物资管理</div>
                    <div class="header-nav-item" id="nav-special-record">双随机一公开</div>
                    <div class="header-nav-item" id="nav-safetyIndex">单位安全指数</div>
                    <div class="header-nav-item" id="nav-building">建筑物管理</div>
                </div>
            </div>
        </div>
        <div class="main">
            <div class="main-left">
                <div class="left-overview">
                    <div class="main-title"><img src="../static/img/home/icon8.png" alt="">
                        全区数据</div>
                    <div class="left-overview-top">
                        <div><img src="../static/img/home/icon4.png" alt="">
                            <img class="layui-anim layui-anim-rotate layui-anim-loop" src="../static/img/home/icon5.png"
                                style="position: absolute;width: 0.9rem;height: 0.9rem;">
                            <div>当前在线率</div>
                            <div>100%</div>
                        </div>
                        <div><img src="../static/img/home/icon2.png" alt="">
                            <div>当前告警率</div>
                            <div>2%</div>
                        </div>
                        <div><img src="../static/img/home/icon3.png" alt="">
                            <div>当前离线率</div>
                            <div>0%</div>
                        </div>
                    </div>
                    <div class="left-overview-bottom">
                        <img src="../static/img/home/1.webp">
                        <div class="left-overview-bottom-item">
                            <div>
                                <div>单位</div>
                                <div>总数</div>
                            </div>
                            <div id="monitor-days">423</div>
                        </div>
                        <div class="left-overview-bottom-item">
                            <div>
                                <div>设备安装</div>
                                <div>监控总数</div>
                            </div>
                            <div id="total-device">2546</div>
                        </div>
                        <div class="left-overview-bottom-item">
                            <div>
                                <div>高层建</div>
                                <div>筑总数</div>
                            </div>
                            <div id="high-building">689</div>
                        </div>
                    </div>
                </div>
                <div class="left-count">
                    <div class="main-title"><img src="../static/img/home/icon10.png" alt="">
                        <span id="left-count-title"></span></div>
                    <div class="left-count-chart" id="left-count-chart">
                    </div>
                </div>
            </div>
            <div class="main-middle">
                <div class="middle-map">
                    <div class="map-title">
                        <div> <img src="../static/img/home/icon9.png" alt="">
                            全区地图</div>
                        <div class="map-title-count">
                            <div class="map-nav selected" data-type="1">全区安装设备 <span>2546</span>个</div>
                            <div class="map-nav" data-type="2">当前监控告警 <span>51</span>个</div>
                        </div>
                    </div>
                    <div class="map-body">
                        <div id="map-body">
                            <div>
                                <div class="map-point">
                                </div>
                            </div>
                        </div>
                        <div class="map-tool-all">
                            <img src="../static/img/home/tool.png">
                        </div>
                    </div>
                </div>
                <div class="middle-chart">
                    <img src="../static/img/home/bg6.png">
                    <div class="middle-chart-body">
                        <div id="middle-chart-body">
                        </div>
                    </div>
                </div>
            </div>
            <div class="main-right">
                <div class="right-overview">
                    <div class="main-title"><img src="../static/img/home/icon8.png" alt="">
                        分类建筑监控总览</div>
                    <div class="right-overview-body">
                        <img src="../static/img/home/2.webp">
                        <div>学校<span id="school-num">18</span></div>
                        <div>小区<span id="community-num">125</span></div>
                        <div>医院<span id="hospital-num">12</span></div>
                        <div>工厂<span id="factory-num">43</span></div>
                        <div>商业综合体<span id="large-complex-num">17</span></div>
                    </div>
                </div>
                <div class="right-alert">
                    <div class="main-title"><img src="../static/img/home/icon12.png" alt="">
                        告警事件</div>
                    <div class="right-alert-list">
                        
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="../static/js/util/jquery.min.js"></script>
    <script type="text/javascript" src="../static/js/util/echarts.min.js"></script>
    <script type="text/javascript"
        src="https://webapi.amap.com/maps?v=1.4.15&key=6125416e635535d089ac5150ae8ebe04&plugin=Map3D,AMap.DistrictSearch,AMap.Scale,AMap.Driving"></script>
    <!-- biz -->
    <script type="text/javascript" src="../static/js/biz/app.js"></script>
    <script type="text/javascript" src="../static/js/biz/home.js"></script>
    <script type="text/javascript" src="../static/js/biz/curtime.js"></script>
    <script type="text/javascript" src="../static/js/layui/layui.all.js"></script>
</body>

</html>